{% extends "index/main.html" -%}
{% block css -%}
<style type="text/css">
@page {
	size: A4 portrait;
	margin: 0;
}

@media print {
	body {
		-webkit-print-color-adjust: exact;
	}
	html, body {
		width: 210mm;
		height: 297mm;
	}
	.table {
		width: 99%;
		border: 1px solid #000;
		border-collapse: collapse;
	}
	.table tr th, .table tr td {
		background-color: #fff;
	}
}
</style>
{% endblock css -%}
{% block content -%}
<div class="box-content">
	<form id="tab_form">
		<div class="group-form">
			<div class="group-label">姓名</div>
			<div class="group-content">
				<input type="text" name="name">
			</div>
			<div class="group-label">出乘日期</div>
			<div class="group-content">
				<input type="text" id="workDate" name="workDate" class="iceDate-icon">
			</div>
			<div class="group-content">
				<button type="button" onclick="query('tab', 1)" class="btn bg-royal">查询</button>
			</div>
		</div>
		<div class="group-form">
			<div class="group-label">车次</div>
			<div class="group-content">
				<select name="trains" class="sel">
					<option value=""></option>
					{% for me in trains -%}
					<option value="{{me.name}}">{{me.name}}</option>
					{% endfor -%}
				</select>
			</div>
			<div class="group-label">退乘日期</div>
			<div class="group-content">
				<input type="text" id="quitDate" name="quitDate" class="iceDate-icon">
			</div>
			<div class="group-content">
				<a href="javascript:history.back();" class="btn bg-royal">返回</a>
			</div>
		</div>
	</form>
	<div id="page1">
		<table id="tab" size="24" highlight="false" url="{{ctx}}/market/routeData.html" class="table table-border table-responsive table-hover">
			<thead>
				<tr>
					<th>序号</th>
					<th field="workDate">出乘日期</th>
					<th field="quitDate">退乘日期</th>
					<th field="trains">车次</th>
					<th field="name">销售人员</th>
				</tr>
			</thead>
		</table>
	</div>
</div>
<div id="tab_page"></div>
<div align="center">
	<button type="button" onclick="print('#page1')" class="btn bg-royal">打印</button>
	<a href="javascript:history.back();" class="btn bg-royal">返回</a>
</div>
<script type="text/javascript">
	ice(function() {
        iceui.use('date', function() {
            ice.date({
                id : 'workDate',
                format : 'y-m-d'
            });
            ice.date({
                id : 'quitDate',
                format : 'y-m-d'
            });
        });
		query('tab', 1);
		iceui.use('print', function(){});
	});
</script>
{% endblock content -%}
